
TM.loadScript("dom", "canvas");
TM.loadScript("app");
TM.loadScript("app", "sprite");

// 
TM.addNamespace("stats", "../../plugins/Stats");
TM.loadStats();

/**
 * main
 */
TM.main(function()
{
    init();
    run();
});

var init = function() {
    var app = TM.global.app = TM.App.CanvasApp();
    app.fps = 30;
    app.scene.background = "rgba(255, 255, 255, 1)";
    app.enableStats();
    
    var image = TM.global.image = new Image();
    image.src = "";
    var image2 = TM.global.image2 = new Image();
    image2.src = "";
    
    for (var i=0; i<3; ++i) {
        for (var j=0; j<7; ++j) {
            var sprite = app.scene.addChild(TM.App.Sprite());
            sprite.x = 200 + j*250;
            sprite.y = 200 + i*250;
            sprite.width = 200;
            sprite.height= 200;
            sprite.graphics.fillRect(-100, -100, 200, 200);
            sprite.graphics.strokeStyle = "white";
            sprite.graphics.fillStyle = "white";
        }
    }
    
    app.scene.draw = function(graphics) {
        graphics.save();
        
        // graphics.globalCompositeOperation = "lighter";
        graphics.fillStyle   = "rgb(255, 200, 200)";
        graphics.fillCircle(100, 300, 500);
        graphics.fillStyle   = "rgb(200, 255, 200)";
        graphics.fillCircle(900, 600, 500);
        graphics.fillStyle   = "rgb(200, 200, 255)";
        graphics.fillCircle(1700, 500, 500);
        graphics.restore();
    };
    
    // 描画系テスト
    testRect(app.scene.children[0]);
    testCircle(app.scene.children[1]);
    testTriangle(app.scene.children[2]);
    testFigure(app.scene.children[3]);
    testHinomaru(app.scene.children[4]);
    testImage(app.scene.children[5]);
    testImage2(app.scene.children[6]);
    
    // ImageData系
    testImageData(app.scene.children[7]);
    testNoise(app.scene.children[8]);
    testFilter(app.scene.children[9], "MonochromeFilter");
    testFilter(app.scene.children[10], "ReverseFilter");
    testFilter(app.scene.children[11], "RedFilter");
    testFilter(app.scene.children[12], "GreenFilter");
    testFilter(app.scene.children[13], "BlueFilter");
    
    // 多角形
    testRoundRect(app.scene.children[14]);
    testPolygon(app.scene.children[15]);
    testStar(app.scene.children[16]);
};


var testRect = function(sprite) {
    sprite.graphics.strokeRect(-80, -80, 100, 100);
    sprite.graphics.fillRect(-20, -20, 100, 100);
};
var testRoundRect = function(sprite) {
    sprite.graphics.strokeRoundRect(-80, -80, 100, 100, 10);
    sprite.graphics.fillRoundRect(-20, -20, 100, 100, 10);
};
var testPolygon = function(sprite) {
    sprite.graphics.strokePolygon(-30, -30, 50, 3);
    sprite.graphics.fillPolygon(30, 30, 50, 5);
};
var testStar = function(sprite) {
    sprite.graphics.strokeStar(-30, -30, 50, 6, 0.6);
    sprite.graphics.fillStar(30, 30, 50, 5);
    sprite.graphics.fillStar(0, 0, 50, 4, 0.1, 90);
};
var testCircle = function(sprite) {
    sprite.graphics.strokeCircle(-30, -30, 50);
    sprite.graphics.fillCircle(30, 30, 50);
};

var testTriangle = function(sprite) {
    sprite.graphics.save();
    sprite.graphics.translate(-25, -25);
    sprite.graphics.strokeTriangle(0, -50, -50, 50, 50, 50);
    sprite.graphics.restore();
    
    sprite.graphics.save();
    sprite.graphics.translate(25, 25);
    sprite.graphics.fillTriangle(0, -50, -50, 50, 50, 50);
    sprite.graphics.restore();
};

var testFigure = function(sprite) {
    sprite.graphics.fillStyle = "red";
    sprite.graphics.fillCircle(0, 0, 50);
    sprite.graphics.fillStyle = "green";
    sprite.graphics.fillRect(-30, -30, 60, 60);
    sprite.graphics.fillStyle = "blue";
    sprite.graphics.fillTriangle(0, -25, -25, 25, 25, 25);
    sprite.scaleX = 1.25;
    
    sprite.update = function() {
        this.rotate += 2;
        // console.log(TM.App.CanvasApp.instance.mouse.x, TM.App.CanvasApp.instance.mouse.y);
    }
};

var testHinomaru = function(sprite)
{
    var baseSize = 32;
    var width  = baseSize*3;
    var height = baseSize*2;
    sprite.graphics.strokeRect(-width/2, -height/2, width, height);
    sprite.graphics.fillStyle = "white";
    sprite.graphics.fillRect(-width/2, -height/2, width, height);
    sprite.graphics.fillStyle = "hsl(0, 50%, 50%)";
    sprite.graphics.fillCircle(0, 0, baseSize*3/5);
};

var testImage = function(sprite)
{
    var image = TM.global.image;
    image.addEventListener("load", function() {
        // sprite.width  = this.width;
        // sprite.height = this.height;
        sprite.graphics.fillRect(-sprite.width/2, -sprite.height/2, sprite.width, sprite.height);
        sprite.graphics.stroke(-sprite.width/2, -sprite.height/2, sprite.width, sprite.height);
        sprite.graphics.drawImage(image, -this.width/2, -this.height/2);
    });
};

var testImage2 = function(sprite)
{
    
    var image = TM.global.image2;
    image.addEventListener("load", function() {
        sprite.graphics.fillRect(-sprite.width/2, -sprite.height/2, sprite.width, sprite.height);
        sprite.graphics.stroke(-sprite.width/2, -sprite.height/2, sprite.width, sprite.height);
        sprite.graphics.drawImage(image, -this.width/2, -this.height/2);
    });
};

var testImageData = function(sprite)
{
    sprite.graphics.fillCircle(0, 0, 80);
    var imageData = sprite.graphics.getImageData();
    imageData.filter({
        r: 0.5,
        g: 0.5,
        b: 1.0,
        calc: function(p, index, x, y, data){
            if (y/2%2==0) {
                p[0] *= this.r;
                p[1] *= this.g;
                p[2] *= this.b;
                data.setPixelFromArray(index, p);
            }
            else {
                data.setPixelFromNumber(index, 0xffffff);
            }
        }
    });
    sprite.graphics.putImageData(imageData, 0, 0);
};


var testNoise = function(sprite)
{
    var imageData = sprite.graphics.getImageData();
    imageData.noise();
    sprite.graphics.putImageData(imageData, 0, 0);
};

var testFilter = function(sprite, filter_name)
{
    var image = TM.global.image2;
    image.addEventListener("load", function() {
        sprite.graphics.drawImage(image, -this.width/2, -this.height/2);
        var imageData = sprite.graphics.getImageData();
        imageData.filter(TM.Graphics[filter_name]);
        sprite.graphics.putImageData(imageData, 0, 0);
    });
};

var testRedFilter = function(sprite)
{
    var image = TM.global.image2;
    image.addEventListener("load", function() {
        sprite.graphics.drawImage(image, -this.width/2, -this.height/2);
        var imageData = sprite.graphics.getImageData();
        imageData.filter(TM.Graphics.RedFilter);
        sprite.graphics.putImageData(imageData, 0, 0);
    });
};

var testMonochromeFilter = function(sprite)
{
    var image = TM.global.image2;
    image.addEventListener("load", function() {
        sprite.graphics.drawImage(image, -this.width/2, -this.height/2);
        var imageData = sprite.graphics.getImageData();
        imageData.filter(TM.Graphics.MonochromeFilter);
        sprite.graphics.putImageData(imageData, 0, 0);
    });
};


var run = function() {
    TM.global.app.run();
};

